/* assets/css/pages/services.css */

.services-dossier {
    background: #000000;
    min-height: 100vh;
    padding: 120px 0;
    color: #ffffff;
    font-family: 'JetBrains Mono', monospace;
}

.services-interface {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 60px;
}

/* Header Styling */
.s-header { margin-bottom: 100px; }
.s-clearance { font-size: 0.7rem; letter-spacing: 5px; color: #8b2cf5; margin-bottom: 20px; }
.s-title { font-size: clamp(2.5rem, 8vw, 5rem); font-weight: 900; letter-spacing: -4px; margin: 0; }
.s-tagline { font-size: 1rem; color: rgba(255,255,255,0.4); margin-top: 15px; letter-spacing: 1px; }

/* Grid Layout */
.capability-matrix {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
    margin-bottom: 80px;
}

.cap-unit {
    background: rgba(255, 255, 255, 0.02);
    border: 1px solid rgba(255, 255, 255, 0.05);
    padding: 50px 40px;
    transition: 0.4s ease;
}

.cap-unit:hover {
    background: rgba(139, 44, 245, 0.03);
    transform: translateY(-10px);
}

.red-border:hover { border-color: #ff003c; }
.blue-border:hover { border-color: #0070ff; }
.purple-border:hover { border-color: #8b2cf5; }

.cap-label { font-size: 0.65rem; color: rgba(255,255,255,0.3); letter-spacing: 3px; margin-bottom: 30px; }

.cap-title { font-size: 1.4rem; font-weight: 900; line-height: 1.3; margin-bottom: 20px; color: #fff; }

.cap-desc { font-size: 0.85rem; color: rgba(255,255,255,0.4); line-height: 1.6; margin-bottom: 30px; }

.cap-list { list-style: none; padding: 0; }
.cap-list li { font-size: 0.8rem; color: rgba(255,255,255,0.6); margin-bottom: 12px; transition: 0.3s; }
.cap-unit:hover .cap-list li { color: #fff; }

/* Methodology Banner */
.methodology-banner {
    background: rgba(139, 44, 245, 0.05);
    border: 1px solid rgba(139, 44, 245, 0.2);
    padding: 40px;
    display: flex;
    align-items: center;
    gap: 20px;
}

.m-prompt { font-size: 1.5rem; color: #8b2cf5; font-weight: bold; }
.m-text { font-size: 1.1rem; color: rgba(255,255,255,0.8); }

@media (max-width: 1100px) {
    .capability-matrix { grid-template-columns: 1fr; }
}